<template>
  <div id="header">
    <el-button type="primary" @click="toggleDark">
      {{ themeClist.themeColors }}
    </el-button>
    <el-button @click="collMenu()">
      折叠面板
    </el-button>
  </div>
</template>

<script setup lang="ts" name="header">
import { ref, watch } from 'vue'
import { useStore } from '@/stores'
let themeClist = useStore()
function toggleDark() {
  if (themeClist.themeColors == 'Light') {
    themeClist.themeColors = 'Dark'
  } else {
    themeClist.themeColors = 'Light'
  }
}
function collMenu() {
  if (themeClist.menuIs == true) {
    themeClist.menuIs = false
  } else {
    themeClist.menuIs = true
  }
}
</script>
<!-- scoped 当前组件颜色 -->
<style></style>
